<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<t:base type="jquery,easyui,tools,DatePicker"></t:base>

<div class="easyui-layout" fit="true" id="addApplyForm">
 <t:formvalid formid="formobj" dialog="true"  layout="table" action="groupPRController.do?saveQueryApply" beforeSubmit="checkData();" >
	<input name="id" type="hidden" value="${applyObj.id }">
	<input name="selectGroupIds"  id="selectGroupIds" type="hidden" value="${applyObj.selectGroupIds}">
    <div region="north"  style="height:35px;padding: 0px;border:0px;" >
		        <table style="width: 100%;" cellpadding="0" cellspacing="1" class="formtable" align="center">
			        <tr height="30">
						<td  width="15%" align="center"><label class="Validform_label">开始月份 </label></td>
						<td  class="value" width="35%">
						    <input class="Wdate" onClick="WdatePicker({dateFmt:'yyyy-MM'})" style="width: 80%;" id="startMonth"
						       name="startMonth" ignore="ignore" value="${applyObj.startMonth }">
			            
			            </td>
			            
			            <td width="15%" align="center"><label class="Validform_label">结束月份 </label></td>
						<td class="value" width="35%">
						    <input class="Wdate" onClick="WdatePicker({dateFmt:'yyyy-MM'})" style="width: 80%;" id="endMonth"
						       name="endMonth" ignore="ignore" value="${applyObj.endMonth }"> 
			            </td>
					</tr>						        
		        </table>
     </div>
  
    <div region="center" style="border:0px;padding: 0px;" split="true">   
           <table style="width: 100%;" cellpadding="0" cellspacing="1" border="0" class="formtable" align="center">
				<tr height="460">
					<td  width="50%">
						<t:datagrid name="groupList"  title="" actionUrl="groupPRController.do?groupGrid" idField="id" treegrid="false" pagination="true"  sortOrder="desc" sortName="createDatetime" onLoadSuccess="">
				            <t:dgCol title="申请编号" field="id" hidden="true"></t:dgCol>
				            <t:dgCol title="集团用户名称" field="groupName" width="120"  query="true"></t:dgCol>		
				            <t:dgCol title="common.operation" field="opt" ></t:dgCol>		           
				            <t:dgFunOpt funname="setCustomerNo(id,groupName)" title="添加"></t:dgFunOpt>				            
				        </t:datagrid>
					</td>
					<td  width="50%" valign="top">	
					  <div style="height:460px;overflow:scroll;">				
						  <table style="width: 100%;" cellpadding="3" cellspacing="1" border="0" class="formtable" align="center" id="selectedGroupsList">
						     <tr>
						     	<td align="center" height="30" colspan="2"><label class="Validform_label">已选择集团用户列表【<label id='totalCount'>${initCont }</label>】</label></td>
						     </tr>
						     <!-- 遍历处理意见 -->			
			<c:forEach var="agd" items="${selectGroupList }" >  
			    <tr id="${agd.groupInfo.id }" height='30'>
					<td width='90%' align='center' >${agd.groupInfo.groupName }</td>
					<td width='10%' align='center' title='删除'><img style='cursor:hand' src='images/delete.jpg' width='18' height='18' onclick="removeTr('${agd.groupInfo.id }')"></td>
				</tr>
			</c:forEach>
						     
						  </table>
					  </div>
					</td>
				</tr>
			</table>
       
       </div>
  </t:formvalid>

</div>

<script type="text/javascript">
     //已选择集团户数
    var totalCnt = ${initCont };
    //已选择集团ID集合
    var groupIdsArr = new Array();
    
    $(function() {
    	var selectGroupIds = $("#selectGroupIds").val();
    	if(selectGroupIds!=''){
    		var arrIds = selectGroupIds.split(',');
    		for(var i=0;i<arrIds.length;i++){
    			groupIdsArr.push(arrIds[i]);
    		}
    	}
    	
    });
    
    /**添加集团用户**/
	function setCustomerNo(id, groupName){
		var flag = false;
		$.each(groupIdsArr, function(index,item){
                if(item==id){
                	$.messager.alert('&nbsp;&nbsp;信息提醒','该集团用户已添加！', 'info');
                	flag = true;
                	return false;
                }
         });
		if(flag)return;
		
		$("#selectedGroupsList").append("<tr id="+id+" height='30'>"
				                              +"<td width='90%' align='center' >"+groupName+"</td>"
				                              +"<td width='10%' align='center' title='删除'><img style='cursor:hand' src='images/delete.jpg' width='18' height='18' onclick=\'removeTr("+id+")\'></td>"
				                      +"</tr>");  
		groupIdsArr.push(id);
		$("#selectGroupIds").val(groupIdsArr.toString());
		
		totalCnt = totalCnt+1;
		$("#totalCount").html(totalCnt);
	}
	
	/**删除已选择集团用户**/
	function removeTr(gid){
		$.each(groupIdsArr, function(index,item){
            if(item==gid){
            	groupIdsArr.splice(index,1);
            }
        });
		$("#selectGroupIds").val(groupIdsArr.toString());
		
		$("#"+gid).remove();
		totalCnt = totalCnt-1;
		$("#totalCount").html(totalCnt);
	}
	
	/**数据项验证**/
	function checkData(){
		if($('#startMonth').val()==''){
        	$.messager.alert('&nbsp;&nbsp;信息提醒','申请查询开始月份不能为空！', 'info');
        	return false;
        }	
		
		if($('#endMonth').val()==''){
        	$.messager.alert('&nbsp;&nbsp;信息提醒','申请查询结束月份不能为空！', 'info');
        	return false;
        }
		
		if($('#startMonth').val()>$('#endMonth').val()){
			$.messager.alert('&nbsp;&nbsp;信息提醒','开始月份不能大于结束月份！', 'info');
        	return false;
		}
		
		if($('#selectGroupIds').val().trim()==''){
        	$.messager.alert('&nbsp;&nbsp;信息提醒','请选择要查询的集团用户！', 'info');
        	return false;
        }
		
	}
</script>

